<!--
 * @Author: weikang
 * @Description:
 * @Date: 2024-01-09 21:19:16
 * @LastEditTime: 2024-02-28 20:28:01
 * @FilePath: \env-manager-pc\src\views\assets\get\edit.vue
-->
<script setup lang="ts">
import type { FormInstance } from 'element-plus'
import dayjs from 'dayjs'
import { rules, useInitForm } from './page'
import { OperateType } from './operate.common'
import type { ModelOpenCustom } from '@/types/page'
import useUserStore from '@/store/modules/user'
import entApi from '@/api/modules/ent'
import { useEnvOrgs } from '@/utils/dataHook'

const emits = defineEmits(['submit'])
const userStore = useUserStore()
const dialogVisible = ref(false)
const { formData, initForm } = useInitForm()
const formRef = ref<FormInstance>()
const btnLoading = ref(false)
const modelType = ref(OperateType.single)
const tempRowData = ref<any>({})
const envOrgs = useEnvOrgs()

const getTime = ref('')

function open(options: ModelOpenCustom<OperateType>) {
  modelType.value = options.type
  if (options.data) {
    tempRowData.value = { ...options.data as any }
    if (options.type === OperateType.single) {
      formData.value.assetObjIDs = [tempRowData.value.AssetObjID]
    }
    else {
      formData.value.assetObjIDs = tempRowData.value.assetObjIDs
    }
  }
  getTime.value = dayjs().format('YYYY-MM-DD')
  dialogVisible.value = true
  queryEnt('')
}

function doLoading(flag: boolean) {
  btnLoading.value = flag
}

function submit() {
  formRef.value?.validate((vaild) => {
    if (vaild) {
      emits('submit', formData.value, doLoading)
    }
  })
}

function close() {
  dialogVisible.value = false
  btnLoading.value = false
  initForm()
}

const entList = ref<any>([])
const loadEnt = ref(false)
function queryEnt(query: string) {
  loadEnt.value = true
  entApi.GetEnterprises({
    objFilter: {
      Type: 'DIM.Units.Filters.NameFilter',
      Value: [query],
    },
    pageSize: 0,
    pageNum: 0,
  },
  ).then((res) => {
    const { Objs } = res
    entList.value = Objs
    loadEnt.value = false
  }, () => {
    loadEnt.value = false
  })
}

defineExpose({
  open,
  close,
})
</script>

<template>
  <el-dialog
    v-model="dialogVisible"
    append-to-body
    title="领用"
    width="80%"
    top="1%"
    draggable
    @closed="close"
  >
    <div class="max-h-[65vh] w-full overflow-x-hidden overflow-y-auto">
      <ElForm ref="formRef" label-width="180px" label-position="top" label-suffix="：" :model="formData" :rules="rules">
        <ElRow :gutter="30">
          <ElCol v-if="modelType === OperateType.single" :span="12">
            <ElFormItem label="设备编码" prop="Name">
              <ElInput v-model="tempRowData.AssetCode" disabled />
            </ElFormItem>
          </ElCol>
          <ElCol :span="12">
            <ElFormItem label="领用日期" prop="Name">
              <ElInput v-model="getTime" disabled />
            </ElFormItem>
          </ElCol>
          <ElCol v-if="modelType === OperateType.single" :span="12">
            <ElFormItem label="产品名称" prop="AssetModelClassifyName">
              <ElInput v-model="tempRowData.AssetModelClassifyName" disabled />
            </ElFormItem>
          </ElCol>
          <ElCol v-if="modelType === OperateType.single" :span="12">
            <ElFormItem label="型号" prop="AssetModelName">
              <ElInput v-model="tempRowData.AssetModelName" disabled />
            </ElFormItem>
          </ElCol>
          <ElCol :span="12">
            <ElFormItem label="资产状态" prop="StateName">
              <ElInput value="领用" disabled />
            </ElFormItem>
          </ElCol>
          <ElCol :span="12">
            <ElFormItem label="领用人" prop="Location">
              <ElInput v-model="userStore.userInfo.Name" disabled />
            </ElFormItem>
          </ElCol>
          <ElCol :span="12">
            <ElFormItem label="计划安装地点" prop="enterpriseObjID">
              <el-cascader
                v-model="formData.envOrgObjID" :options="envOrgs" class="w-full" :props="{ emitPath: false,
                                                                                           children: 'Children',
                                                                                           label: 'Name',
                                                                                           value: 'Code' }"
              />
            </ElFormItem>
          </ElCol>
          <ElCol :span="12">
            <ElFormItem label="备注" prop="Location">
              <ElInput v-model="formData.remark" />
            </ElFormItem>
          </ElCol>
        </ElRow>
      </ElForm>
    </div>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="dialogVisible = false">取消</el-button>
        <el-button type="primary" :loading="btnLoading" @click="submit">
          确定
        </el-button>
      </span>
    </template>
  </el-dialog>
</template>
